<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <script src="font/iconfont.js"></script>
    <title>个性签名</title>
    <style>
        h2,p,ul,body{
            padding: 0;
            margin: 0;
        }
        .title{
            display: flex;
            width: 100%;
            height: 37px;
            padding-top: 13px;
            border-bottom: 1px solid rgb(241, 241, 241);
        }
        a{
            text-decoration: none;
            color: #000;
        }
        .title .icon_titjt{
            width: 30px;
            height: 30px;
        }
        .title h2{
            font-size: 15px;
            margin-left: 35%;
        }
        .title #finish{
            display: inline-block;
            border: none;
            color: rgb(5, 154, 248);
            background-color: #fff;
            font-size: 17px;
            margin-left: 190%;
            font-weight: bold;
        }
        #fm #text{
            width: 90%;
            margin-left: 5%;
            display: flex;
            height: 30px;
            font-size: 17px;
            padding-top: 10px;
            line-height: 32px;
            border:0;
        }
        .error{
            font-size: 17px;
            font-weight: bold;
            margin-left: 20px;
            color: #f00;
            display: none;
        }

        .xinxi{
            text-align: center;
            margin-top: 500px;
        }
    </style>
</head>
<body>
    <form action="./project7.html" method="post" 
    id="fm" name="fm" onsubmit="return checkform()">
    <div class="title">
        <a href="./project7.html">
            <svg class="icon_titjt" aria-hidden="true">
                <use xlink:href="#icon-zuojiantou"></use>
            </svg>
        </a>
        <h2>编辑个性签名</h2>
        <div>
            <input id="finish"type="submit" value="完成">
        </div> 
    </div>
    <div>
        <input type="text" placeholder="填写个性签名更容易获得关注哦~" id="text" name="text" class="input">
        <span class="error">个性签名不能为空哦</span>
    </div>
    </form>

    <div class="xinxi">常月华19001011027</div>

    <!-- js4 -->
    <script>
        var text=document.getElementById("text");
        var error=document.getElementsByClassName("error");
        user.onchange=checktext;
        function checktext(){
            if(text.value.length>=1&&text.value.length<=20){
                error[0].style.display="none";
                return 1;
            }
            else{
                error[0].style.display="block";
                return 0;
            }
        }
        function checkform(){
            var rs=checktext();
            if(rs==0){
                return false;
            }
            return true;
        }
    </script>
</body>
</html>